<template>
	<Grid :col="3" :border="false" padding="5px" v-auth:service:log:search>
	  <GridItem> <Input  placeholder="请输入日志编号" v-model="search.id"/></GridItem>
	  <GridItem><Input  placeholder="请输入方法名" v-model="search.methodName"/></GridItem>
	  <GridItem><Input  placeholder="请输入操作人员" v-model="search.user"/></GridItem>
	  <GridItem> <Input  placeholder="请输入IP地址" v-model="search.ip"/></GridItem>
	  <GridItem><Input  placeholder="请输入操作地点" v-model="search.address"/></GridItem>
	  <GridItem>
		  <Select style="width:100%" clearable  placeholder="请选择操作状态" v-model="search.status">
			  <Option v-for="item in statusList" :value="item.value" :key="item.value">{{ item.label }}</Option>
		  </Select>
	  </GridItem>
	  <GridItem>
		  <Select style="width:100%" clearable  placeholder="请选择操作方式" v-model="search.method">
			  <Option v-for="item in methodList" :value="item" :key="item">{{ item }}</Option>
		  </Select>
	  </GridItem>
	  <GridItem>
        <DatePicker type="daterange" confirm placement="bottom-end" v-model="times"
                    split-panels
                    :editable="false" placeholder="请选择操作时间" style="width: 100%;"/>
    </GridItem>
	  <GridItem><Button icon="md-search" type="primary" @click="searchText">查询</Button></GridItem>
	</Grid>
	
</template>

<script>

export default {
  props: {
    modelValue: {
      type: Object,
      required:false,
      default: {}
    }
  },
	data() {
		return {
      times: ["", ""] ,
      search: this.modelValue,
			statusList: [{label: '成功',  value: 1},  {label: '异常', value : 0}],
			methodList: ["GET", "POST", "PUT", "DELETE", "OPTIONS"]
		}
	},
  emits: ["update:model-value", "search"],
  watch: {
    times: function(array) {
      this.search.start = this.formatDate(array[0]) ;
      this.search.end = this.formatDate(array[1]) ;
    }
  },
  methods: {
    searchText() {
       this.$emit("update:model-value", this.search);
       this.$emit("search", this.search);
    },
    formatDate(date) {
      if (date === "") return null ;
      let year = date.getFullYear();
      let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1 ;
      let day =date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      return `${year}-${month}-${day}`
    },
  }
}

</script>

<style>
</style>